실행 컨텍스트

실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체다. 실행 컨텍스트는 전역 코드나 함수가 실행될 때 마다 생성되며 콜스택에 쌓이게 된다. 실행컨텍스트들은 FIFO(First in First Out) 구조의 콜스택에 순차적으로 적재되기 때문에, 자바스크립트 코드의 실행 환경이 안정적이게 보장될 수 있다.

보다 자세히 실행 컨텍스트들의 생성과 실행 과정을 살펴보면 다음과 같다. 자바스크립트가 로드되면, 먼저 전역 실행 컨텍스트가 생성된다. 이 '전역 실행 컨텍스트'에서 전역 객체와 전역 변수들이 생성되고 초기화 된다. 그리고 함수가 호출될 때마다 새로운 함수 실행 컨텍스트가 생성된다. 각 함수 실행 컨텍스트는 독립적이며, 함수의 매개변수, 변수, 내부 함수 등을 포함한다.

실행 컨텍스트의 구성 요소

실행 컨텍스트는 코드의 환경 정보를 모아놓은 객체라 했다. 그리고 실행 컨텍스트는 다음과 같은 세 가지 요소로 구성된다.

- Variable Environment

실행 컨텍스트가 생성될 때 식별자들의 정보나 외부 환경 정보를 담는다. 현재 컨텍스트 내부의 식별자 정보인 환경레코드(environmentRecord)와 외부 환경 레퍼런스(outerEnvironmentReference)를 포함한다. 최초 상태의 스냅샷(특정 시점의 데이터 복사본)을 유지하며 변경사항이 반영되지 않는다.

- Lexical Environment

Variable Environment의 복사본으로 처음에는 이와 담기는 내용이 같지만, 변경 사항이 실시간으로 반영된다. 즉, Lexical Environment는 해당 실행 컨텍스트의 초기 환경을 기억하며 최신 상태를 저장한다. 그리고 Variable Environment와 마찬가지로 환경 레코드와 외부 환경 레퍼런스을 포함한다.

- This Binding

this의 값 할당이 결정되는 곳이다. 실행 컨택스트 내에서 ‘this’ 키워드가 참조하는 값을 결정한다. this가 지정되어 있지 않은 경우 전역 객체가 바인딩된다.

실행 컨텍스트와 호이스팅

변수들이 컨텍스트 최상단에 끌어올려진듯한 효과를 호이스팅이라 한다. 이러한 호이스팅은 실행컨택스트의 Lexical Environment 정보수집과정에서 발생하는 현상이다.

실행컨텍스트의 생성 과정에서 Lexical Environment의 환경레코드가 수집된다. 컨택스트가 실행되기 전, 해당 영역에는 현재 컨텍스트와 관련된 코드 식별자 정보들이 순서대로 담겨진다. 따라서 코드가 실행되기도 전에 자바스크립트 엔진은 컨텍스트에 관련한 식별자를 모두 파악하게되며 호이스팅이 발생한다.

변수는 식별자 정보만 호이스팅되며, 해당 식별자에 할당된 데이터는 호이스팅되지 않는다. 해당 데이터는 코드가 실행되며 해당 할당부에 도달했을 때 할당된다. 그 전까지 해당 변수는 값이 할당되기 전이기에 undefined값을 갖는다.

실행 컨텍스트와 스코프 체이닝

스코프란 식별자(변수)의 유효 범위를 의미하며, 스코프 체이닝이란 자바스크립트 엔진이 식별자의 유효범위를 안에서부터 바깥으로 차례로 검색해나가는 것을 뜻한다.

풀어서 설명하면, 자바스크립트를 사용하며 외부 함수의 변수를 내부 함수에서 사용하는 경험을 해보았을 것이다. 이는 내부 함수의 스코프에 의해 가능한 일이다. 자바스크립트 엔진은 현재 스코프에 사용 가능한 식별자가 없을 경우, 접근 가능한 범위의 스코프를 순차적으로 탐색하여 식별자 정보를 찾는데 이것이 스코프 체이닝이라 볼 수 있다.

스코프 체이닝은 Lexical Environment의 두 번째 수집자료인 외부 환경 레퍼런스(outerEnvironmentReference)에 의해 가능하다. 외부 환경 레퍼런스는 현재 함수가 선언될 당시의 Lexical Environment를 참조한다. 이러한 참조를 안에서부터 바깥으로 진행해가며 식별자의 유효범위를 탐색해나간다.

만약 동일한 이름의 식별자가 현재 컨텍스트의 유효범위 안에 있을 때는, 스코프 체인 상 가장 먼저 발견된 식별자만 접근 가능하다. 스코프 체인은 안에서 바깥으로 탐색하기 때문이다. 이러한 특성은 정보 은닉화로도 연결된다. 해당 특성을 사용하여 바깥 공간에 있는 동일명의 식별자 정보를 내부 공간에서 접근할 수 없도록 할 수 있다.

정리

이상 자바스크립트의 실행 컨텍스트에 대해 알아보았다. 실행 컨텍스트는 코드를 실행하기 위한 정보들인 Variable Environment, Lexical Environment, This Binding 등으로 이루어져 있다. 이로 조합된 객체인 실행컨텍스트는 엔진의 콜스택에 순차적으로 쌓이며 순차적으로 코드가 실행된다. 그리고 이러한 동작원리로 인해 자바스크립트가 왜 동기적인 언어인지 예측해볼 수 있다.

다음 자바스크립트 포스팅에서는 자바스크립트의 동작 원리를 다룰 예정이다. 해당 포스팅에서는 어떻게 자바스크립트가 동기적으로 동작하고, 비동기적인 기능들이 처리되는지 다루고자 한다.